<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title></title>
  <script type="text/javascript" src="../internal.js"></script>
  <!--http-->
   <!--<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.1&services=true"></script>-->

  <!--https-->
  <script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=TImbUgdKrdzxPSBHr4GpnGUGnxoOQjya&s=1"></script>
  <style type="text/css">
    .content {
      width: 530px;
      height: 350px;
      margin: 10px auto;
    }
    .content table {
      width: 100%;
    }
    .content table td {
      vertical-align: middle;
    }
    #city,
    #address {
      height: 21px;
      background: #fff;
      border: 1px solid #d7d7d7;
      line-height: 21px;
    }
    #city {
      width: 60px;
    }
    #address {
      width: 130px;
    }
    #is_dynamic_label span {
      vertical-align: middle;
      margin: 3px 0px 3px 3px;
    }
    #is_dynamic_label input {
      vertical-align: middle;
      margin: 3px 3px 3px 50px;
    }
  </style>
</head>
<body>
<div class="content">
  <table>
    <tr>
      <td><var id="lang_city"></var>:</td>
      <td><input id="city" type="text" /></td>
      <td><var id="lang_address"></var>:</td>
      <td><input id="address" type="text" value="" /></td>
      <td>
        <a href="javascript:doSearch()" class="button"><var id="lang_search"></var></a>
      </td>
      <td>
        <label id="is_dynamic_label" for="is_dynamic" style="opacity: 0;">
          <input id="is_dynamic" type="checkbox" name="is_dynamic"/>
          <span><var id="lang_dynamicmap"></var></span>
        </label>
        <!--<label id="is_dynamic_label" for="is_dynamic"><span></span></label>-->
      </td>
    </tr>
  </table>

  <div style="width:100%;height:340px;margin:5px auto;border:1px solid gray" id="container"></div>
</div>
<script type="text/javascript">
  var map = new BMap.Map("container"),
    marker,
    point,
    styleStr;
  map.enableScrollWheelZoom();
  map.enableContinuousZoom();
  function doSearch() {
    if (!document.getElementById("city").value) {
      alert(lang.cityMsg);
      return;
    }
    var search = new BMap.LocalSearch(document.getElementById("city").value, {
      onSearchComplete: function(results) {
        if (results && results.getNumPois()) {
          var points = [];
          for (var i = 0; i < results.getCurrentNumPois(); i++) {
            points.push(results.getPoi(i).point);
          }
          if (points.length > 1) {
            map.setViewport(points);
          } else {
            map.centerAndZoom(points[0], 13);
          }
          point = map.getCenter();
          marker.setPoint(point);
        } else {
          alert(lang.errorMsg);
        }
      }
    });
    search.search(document.getElementById("address").value || document.getElementById("city").value);
  }
  //获得参数
  function getPars(str, par) {
    var reg = new RegExp(par + "=((\\d+|[.,])*)", "g");
    return reg.exec(str)[1];
  }
  function init() {
    var mapNode = editor.selection.getRange().getClosedNode(),
      isMapImg = mapNode && /api[.]map[.]baidu[.]com/gi.test(mapNode.getAttribute("src")),
      isMapIframe = mapNode && domUtils.hasClass(mapNode, "ueditor_baidumap");
    if (isMapImg || isMapIframe) {
      var url, centerPos, markerPos;
      if (isMapIframe) {
        url = decodeURIComponent(mapNode.getAttribute("src"));
        $G("is_dynamic").checked = true;
        styleStr = mapNode.style.cssText;
      } else {
        url = mapNode.getAttribute("src");
        styleStr = mapNode.style.cssText;
      }

      centerPos = getPars(url, "center").split(",");
      markerPos = getPars(url, "markers").split(",");
      point = new BMap.Point(Number(centerPos[0]), Number(centerPos[1]));
      marker = new BMap.Marker(new BMap.Point(Number(markerPos[0]), Number(markerPos[1])));
      map.addControl(new BMap.NavigationControl());
      map.centerAndZoom(point, Number(getPars(url, "zoom")));
    } else {
      point = new BMap.Point(116.404, 39.915); // 创建点坐标
      marker = new BMap.Marker(point);
      map.addControl(new BMap.NavigationControl());
      map.centerAndZoom(point, 10); // 初始化地图,设置中心点坐标和地图级别。
    }
    marker.enableDragging();
    map.addOverlay(marker);
  }
  init();
  document.getElementById("address").onkeydown = function(evt) {
    evt = evt || event;
    if (evt.keyCode == 13) {
      doSearch();
    }
  };
  dialog.onok = function() {
    var center = map.getCenter();
//     var zoom = map.zoomLevel; // http
    var zoom = map.getZoom(); // https

    var size = map.getSize();
    var mapWidth = size.width;
    var mapHeight = size.height;
//     var point = marker.getPoint(); // http
    var point = marker.getPosition(); // https

    if ($G("is_dynamic").checked) {
      var URL = editor.options.UEDITOR_HOME_URL,
        url = [
          URL + (/\/$/.test(URL) ? "" : "/") + "dialogs/map/show.html" + "#center=" + center.lng + "," + center.lat,
          "&zoom=" + zoom,
          "&width=" + mapWidth,
          "&height=" + mapHeight,
          "&markers=" + point.lng + "," + point.lat,
          "&markerStyles=" + "l,A"
        ].join("");
      editor.execCommand(
        "inserthtml",
        '<iframe class="ueditor_baidumap" src="' +
        url +
        '"' +
        (styleStr ? ' style="' + styleStr + '"' : "") +
        ' frameborder="0" width="' +
        (mapWidth + 4) +
        '" height="' +
        (mapHeight + 4) +
        '"></iframe>'
      );
    } else {
      // var url = "http://api.map.baidu.com/staticimage?center=" + center.lng + ',' + center.lat +
      //         "&zoom=" + zoom + "&width=" + size.width + '&height=' + size.height + "&markers=" + point.lng + ',' + point.lat;

      var url =
        "https://api.map.baidu.com/staticimage?s=1&center=" +
        center.lng +
        "," +
        center.lat +
        "&zoom=" +
        zoom +
        "&width=" +
        size.width +
        "&height=" +
        size.height +
        "&markers=" +
        point.lng +
        "," +
        point.lat;
      editor.execCommand(
        "inserthtml",
        '<img width="' +
        size.width +
        '"height="' +
        size.height +
        '" src="' +
        url +
        '"' +
        (styleStr ? ' style="' + styleStr + '"' : "") +
        "/>"
      );
    }
  };
  document.getElementById("address").focus();
</script>
</body>
</html>
